<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>中华人民共和国成立</title>
    <link rel="stylesheet" href="resource/css/base.css">
    <link rel="stylesheet" href="resource/css/style.css">
    <style>
        .roadmap {
            flex: 1; /* 使路线图占满剩余空间 */
            max-width: 80%; /* 最大宽度 */
            margin: 20px auto; /* 上下间距居中 */
            padding: 20px; /* 内边距 */
            background-image: url('images/rode.png');
            background-size: cover;
            border-radius: 8px; /* 圆角效果 */
            box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1); /* 阴影效果 */
        }

        .roadmap-item {
            display: flex; /* 使用Flexbox布局 */
            align-items: center; /* 垂直居中对齐 */
            margin: 100px 0; /* 列表项的上下间距 */
        }

        .roadmap-item:nth-child(even) {
            flex-direction: row-reverse; /* 偶数项反转方向 */
        }

        .roadmap-item img {
            width: 500px; /* 图片宽度 */
            height: auto; /* 自适应高度 */
            margin: 0; /* 图片左右间距 */
            border-radius: 5px; /* 图片圆角效果 */
            box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2); /* 图片阴影效果 */
        }

        .roadmap-item p {
            flex: 1; /* 文字部分占据剩余空间 */
            font-size: 25px;
            margin: 20px; /* 增加四周的间距 */
            line-height: 1.6; /* 改善行高，提升可读性 */

        }

        .roadmap a {
            display: inline-block; /* 链接为块元素 */
            padding: 0px; /* 内边距 */
            color: rgb(255, 255, 255); /* 字体颜色 */
            text-decoration: none; /* 去掉下划线 */
            border-radius: 5px; /* 圆角效果 */
            transition: background-color 0.3s, transform 0.3s; /* 过渡效果 */
            margin-top: 10px; /* 顶部间距 */
        }

        .roadmap a:hover {
            transform: scale(1.05); /* 悬停时轻微放大 */
        }

        /* 小标题样式 */
        h2 {
            color: #000000;
            border-bottom: 2px solid #f9ea1f;
            padding-bottom: 10px;
        }
        .top1 li a.active {
          color: gold;
          font-size: 16px;
          background-color: #ff6c6c;
          font-weight: 700;
        }
    </style>
    <script>
        window.onload = function() {
        const navLinks = document.querySelectorAll('.top1 li a');
          // 为每个导航链接添加点击事件
          navLinks.forEach(link => {
            link.addEventListener('click', function() {
              // 移除所有链接的高亮样式      
              navLinks.forEach(link => {    
                link.classList.remove('active');    
              });   
              // 给当前点击的链接添加高亮样式   
              this.classList.add('active');  
            });  
          });
          navLinks[5].classList.add('active');
        }
    </script>
</head>
<body>


    <ul class="top1 auto clearfix">
        <li><a href="../index.html"class="nav-link">首页</a></li>
        <li><a href="../part1/partone.html"class="nav-link">鸦片战争</a></li>
        <li><a href="../part2/parttwo.html"class="nav-link">辛亥革命</a></li>
        <li><a href="../part3/partthree.html"class="nav-link">五四运动</a></li>
        <li><a href="../part4/Anti-JapaneseWar.html"class="nav-link">抗日战争</a></li>
        <li><a href="../part5/partfive.html"class="nav-link">中华人民共和国成立</a></li>
        <li style="float: right;"><a href="../part0/message.html">留言</a></li>
    </ul>

<div class="sidebar">
    <ul class="sidebar">
    <li><a href="partfive.html">首页</a></li>
    <li><a href="background.html">历史背景</a></li>
    <li><a href="liberation.html">解放战争</a></li>
    <li><a href="founding.html">新中国成立</a></li>
    <li><a href="person.html">伟大领袖</a></li>
    </ul>
</div>



<section class="roadmap">

    <div class="roadmap-item">
        <a href="background.html"><img src="images/index1.png" alt="历史背景"></a>
        <p>
            <strong>历史背景</strong><br>
            在中华人民共和国成立之前，中国经历了长时间的战乱与外敌入侵。19世纪中叶，鸦片战争和甲午战争等挫败使中国陷入半殖民地半封建社会。辛亥革命推翻帝制后，北洋军阀割据，国家陷入内乱。1937年，日本发动全面侵华战争，中国人民在艰苦条件下奋起抗战，最终取得胜利。抗战结束后，国共内战爆发，中国共产党在人民的支持下取得胜利，1949年，中华人民共和国成立，标志着新中国的诞生。
        </p>
    </div>

    <div class="roadmap-item">
        <a href="liberation.html"><img src="images/index2.png" alt="解放战争"></a>
        <p>
            <strong>解放战争</strong><br>
            解放战争于1945年抗日战争胜利后爆发，国共两党为争夺中国政权展开了激烈的斗争。这场战争历时三年，战场遍布全国各地。中国共产党领导的人民解放军在广大农民和工人的支持下，采取了灵活的战略战术，逐步扭转了战局。辽沈、淮海、平津三大战役的胜利尤为关键，使得国民党军队的主力被彻底击溃。1949年，人民解放军成功解放全国，建立了中华人民共和国，结束了内战的混乱局面。        
        </p>
    </div>

    <div class="roadmap-item">
        <a href="founding.html"><img src="images/index3.png" alt="中华人民共和国成立"></a>
        <p>
            <strong>中华人民共和国成立</strong><br>
            1949年10月1日，毛泽东在北京天安门城楼上庄严宣布中华人民共和国的成立，标志着中国历史翻开了崭新的一页。这一时刻象征着中国人民经过长期革命斗争，终于摆脱了帝国主义、封建主义和官僚资本主义的压迫，开始建设社会主义新国家。中华人民共和国的成立不仅结束了中国数十年的内战和动荡，也标志着中国从半殖民地半封建社会迈向独立、统一和民族复兴的新时代，开启了中国现代化建设的新征程。
        </p>
    </div>

    <div class="roadmap-item">
        <a href="person.html"><img src="images/index4.png" alt="中华人民共和国成立"></a>
        <p>
            <strong>人物介绍</strong><br>
            
毛泽东，中华人民共和国的主要缔造者之一，作为中国共产党和中国人民解放军的领袖，他在中国现代历史上占据了重要的地位。1949年10月1日，毛泽东在北京天安门城楼上庄严宣布中华人民共和国成立，标志着中国历史的新纪元。这一重要时刻，不仅是中国人民结束百年屈辱、实现民族独立的里程碑，也是社会主义制度在中国确立的开始。毛泽东以其非凡的政治智慧和坚强的意志，领导中国走上了独立自主的发展道路，开启了现代化建设的新篇章，奠定了新中国的基础。
        </p>
    </div>


</section>

    <div class="footer auto">
        东北林业大学 © 2024 中国近代史科普
    </div>
</body>
</html>
